<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>桥梁</title>
    <meta name="description" content="桥梁">

    <style>
        body{
            height:100%;
            background:#393D49;
            overflow:hidden;
        }
        canvas{
            z-index:-1;
            position:absolute;
        }
        .admin_login{width:300px;height:auto;overflow:hidden;margin:10% auto 0 auto;padding:40px;box-shadow:0 -15px 30px #333;border-radius:5px;background: #0d957a}
        .admin_login dt{font-size:20px;font-weight:bold;text-align:center;color:#f2f2f2;text-shadow:0 0 1px #0e947a;margin-bottom:15px;}
        .admin_login dt strong{display:block;}
        .admin_login dt em{display:block;font-size:12px;margin-top:8px;}
        .admin_login dd{margin:15px 0;height:42px;overflow:hidden;position:relative;}
        .admin_login dd .login_txtbx{font-size:14px;height:26px;line-height:26px;padding:8px 5%;width:90%;text-indent:2em;border:none;background:#5cbdaa;color:white;}
        .admin_login dd .login_txtbx::-webkit-input-placeholder {color:#f4f4f4;line-height:inherit;}
        .admin_login dd .login_txtbx:-moz-placeholder {color:#f4f4f4;line-height:inherit;}
        .admin_login dd .login_txtbx::-moz-placeholder {color:#f4f4f4;line-height:inherit;}
        .admin_login dd .login_txtbx:focus{background:#55b7a4;}
        .admin_login dd:before{font-family:'adminthemesregular';position:absolute;top:0;left:10px;height:42px;line-height:42px;font-size:20px;color:#0c9076;}
        .admin_login dd.user_icon:before{content:"u";}
        .admin_login dd.pwd_icon:before{content:"p";}
        .admin_login dd.val_icon:before{content:"n";}
        .admin_login dd .ver_btn{text-align:right;border:none;color:#f4f4f4;height:42px;line-height:42px;margin:0;z-index:1;position:relative;float:right;background:#48bca5;}
        .admin_login dd .checkcode{float:left;width:182px;height:42px;background:#fff}
        .admin_login dd .checkcode input{width:120px;height:36px;line-height:36px;padding:3px;color:white;outline:none;border:none;text-indent:2.8em;}
        .admin_login dd .checkcode canvas{width:85px;height:36px;padding:3px;z-index:0;background:#5cbdaa;}
        .admin_login dd .submit_btn{width:100%;height:42px;border:none;font-size:16px;background:#ffa122    ;color:#f8f8f8; }
        .admin_login dd .submit_btn:hover{background:#ff9300;color:#f4f4f4;}
        .admin_login dd p{color:#53c6b0;font-size:12px;text-align:center;margin:5px 0;}
    </style>
    <script src="${springMacroRequestContext.contextPath}/jquery/jquery.min.js"></script>
    <script src="${springMacroRequestContext.contextPath}/layui/layui.all.js"></script>
    <script src="${springMacroRequestContext.contextPath}/particleground/particleground.js" tppabs="js/Particleground.js"></script>

</head>
<body>
<dl class="admin_login">
    <dt>
        <strong>桥梁检测</strong>
        <em>管理平台</em>
    </dt>
    <dd class="user_icon">
        <input type="text" name="username" id='username' placeholder="账号" class="login_txtbx"/>
    </dd>
    <dd class="pwd_icon">
        <input type="password" name="password"  id="password" placeholder="密码" class="login_txtbx"/>
    </dd>
    <dd>
        <button id="bs" onclick="login()" type="button"  value="立即登陆" class="submit_btn"/>登录</button>
    </dd>
    <dd>

    </dd>
</dl>
</body>
<script>
    var layer;
    $(document).ready(function() {
        layui.use('layer',function(){
            layer = layui.layer;
        });
        //粒子背景特效
        $('body').particleground({
            dotColor: '#5cbdaa',
            lineColor: '#5cbdaa'
        });
    });


    function login(){
        var username  = $('#username').val();
        var password  = $('#password').val();
        $.ajax({
            url: '${springMacroRequestContext.contextPath}/login',
            type: 'post',
            data:{
                account: username,
                password:password
            },
        }).done(function(data){
                    if(data.code==1){
//                        layer.msg("登录成功");
                        window.location.href = "${springMacroRequestContext.contextPath}/user/list";
                    }else{
                        layer.msg('用户名或密码错误');
                    }
                })
    }
    document.onkeydown = function(e){
        var ev = document.all ? window.event : e;
        if(ev.keyCode==13) {
            login();
        }
    }


</script>
</html>
